$(function () {
   $(".footer").load("/src/footer.html")

})


//
$(function () {
   $(function () {
      // console.log($(".rightbox1"))
      // $(".rightbox1")
      if (!JSON.parse(localStorage.getItem("user"))) {
         $(".rightbox1").show().siblings().hide();
      } else {
         $(".rightbox1").hide().siblings().show();
         console.log(JSON.parse(localStorage.getItem("user")));
         let data = JSON.parse(localStorage.getItem("user"));
         // console.log($(".rightspan"));
         // console.log(data.name);
         $(".rightspan").html(data.uName);
         // console.log($(".tclogin"));
         $(".tclogin").on("click", function () {
            // console.log("111");
            localStorage.clear();
            location.reload();
         })

      }
   })



   function AddJian() {
      jQuery.fn.extend({
         // 参数：
         // $subCheck：子复选框
         // $unBtn:反选按钮
         check: function ($subCheck, $unBtn) {
            //1、 点击全选复选框
            this.click(function () {
               $subCheck.prop("checked", this.checked);
            });
            if ($unBtn) {
               // 点击反选按钮
               $unBtn.click(function () {
                  $subCheck.each(function () {
                     // this: 循环时的当前元素
                     this.checked = !this.checked;
                  });
                  subChangeFather();
               });
            }
            // 点击子复选框
            $subCheck.click(function () {
               subChangeFather();
            })

            var subChangeFather = () => {
               // 循环所有的复选框，看看是不是都选中了呢
               let allCheck = true;//假定都选中了
               $subCheck.each(function () {
                  // this:循环时的当前dom对象。
                  if (this.checked != true) {
                     allCheck = false;
                  }
               });
               this.prop("checked", allCheck);
            }
         }
      });

      $(function () {

         $("table :checkbox:eq(0)").check($("table :checkbox:gt(0)"));
         $("table :checkbox:last").check($("table :checkbox"));


         // console.log($(":checkbox"))
         $(":checkbox").click(function () {
            // 总数量
            // Count();
            totalMoney();
         });

         // input框
         $("tbody tr td").find(".countNum").on("input", function () {
            // console.log($(this));

            let count = $(this).val();
            // if (count <= 0 && count != null) {
            //    alert("输入有误")
            //    // return count=1;
            // }
            let price = $(this).parent().prev().prev().text();
            $(this).parent().next().text(price * count).css({ "color": "#C40000", "font-size": "12px" })
            // 总数量
            Count();
            totalMoney();
            var cid = $(this).data("info");
            $.ajax({
               url: "./api/changeCartNuM",
               type: 'post',
               data: {
                  cid,
                  gnumer: count
               }
            }).then(function (res) {
               console.log(res)
               alert(res.msg);
            })
         })


         // 加
         $(".add_car").on("click", function () {
            // 数量
            let count = $(this).prev().val();
            // console.log(count);
            count++;
            $(this).prev().val(count);
            // 单价
            let price = $(this).parent().prev().prev().html();
            //计算金额
            let money = price * count;
            $(this).parent().next().html(money).css({ "color": "#C40000", "font-size": "12px" });

            Count();
            //总金额
            totalMoney();
            var cid = $(this).data("info");
            $.ajax({
               url: "./api/changeCartNuM",
               type: 'post',
               data: {
                  cid,
                  gnumer: count
               }
            }).then(function (res) {
               alert(res.msg);
            })
         })

         //减
         $(".jian_car").on("click", function () {
            //数量
            let count = $(this).next().val();
            count--;
            if (count <= 1) {
               count = 1;
            }
            $(this).next().val(count);
            //单价
            let price = $(this).parent().prev().prev().html();
            //计算金额
            let money = price * count;
            $(this).parent().next().html(money).css({ "color": "#C40000", "font-size": "12px" });
            // 总数量
            Count();
            // 总金额
            totalMoney();
            var cid = $(this).data("info");
            $.ajax({
               url: "./api/changeCartNuM",
               type: 'post',
               data: {
                  cid,
                  gnumer: count
               }
            }).then(function (res) {
               alert(res.msg);
            })
         });

         $(".delBtn").on("click", function () {
            var thiss = $(this);
            if (!confirm("您好，您确定要从购物车中删除该商品吗？")) {
               return;
            }
            var cid = $(this).data("info");
            console.log(cid);

            $.ajax({
               url: "./api/delete",
               headers: {
                  token: localStorage.getItem("token")
               },
               type: "post",
               data: {
                  cid
               }
            }).then(function (res) {
               layer.alert(res.msg);
               //数据库里 数据真删除后, 删除页面效果

               // $(thiss).parents("tr").remove();
               location.reload();
            })
            // $(this).parent().parent().remove();
            Count();
            totalMoney();

         });
         $(".delBtn1").on("click", function () {
            // $("table :checkbox:eq(0)").check($("table :checkbox:gt(0)"));
            if (!confirm("您好，您确定要删除选中商品吗？")) {
               return;
            }
            // $(this).parent().parent().parent().parent().find("tr:gt(0)").not("tr:last").remove();
            let $cId = $("table tbody .countNum");
            console.log($cId)
            $cId.each(function (index, el) {
               let ele = $(el).parent().parent().find(":checked");
               // console.log(ele.parent().parent().find(".countNum"));
               let cid = ele.parent().parent().find(".countNum").data("info")
               $.ajax({
                  url: "./api/delete",
                  headers: {
                     token: localStorage.getItem("token")
                  },
                  type: "post",
                  data: {
                     cid
                  }
               }).then(function (res) {
                  layer.alert(res.msg);
                  //数据库里 数据真删除后, 删除页面效果
                  location.reload();

               })
            })


            Count()
            totalMoney();

         });
         $(".delBtn2").on("click", function () {
            if (!confirm("您好，您确定要清空购物车吗？")) {
               return;
            }
            var thiss = $(this)
            // $(this).parent().parent().parent().parent().find("tr:gt(0)").not("tr:last").remove();
            let $cId = $("table tbody .countNum");
            $cId.each(function (index, el) {
               let cid = $(el).data("info");
               $.ajax({
                  url: "./api/delete",
                  headers: {
                     token: localStorage.getItem("token")
                  },
                  type: "post",
                  data: {
                     cid
                  }
               }).then(function (res) {
                  layer.alert(res.msg);
                  //数据库里 数据真删除后, 删除页面效果

                  // $(thiss).parent().parent().parent().parent().find("tr:gt(0)").not("tr:last").remove();
                  location.reload();
               })
            })


            Count();
            totalMoney();
         });

      })
      // console.log($("table tr:last").find("span"));
      function totalMoney() {
         let money = 0;
         let $tr = $("table tr:gt(0)").not("table tr:last");
         $tr.each(function () {
            //复选框是不是都选中了
            // console.log($(this).find("td").eq(5).children("b").text());
            if ($(this).find(":checkbox").prop("checked")) {
               money += parseInt($(this).find("td").eq(5).html());
            }
            // console.log(money);
         })
         // console.log(money);
         $("table tr:last").find("span").html(money);
      }

      function Count() {
         let count = 0;
         let $tr = $("table tbody tr");
         // console.log($tr)
         $tr.each(function () {
            count += parseInt($(this).find(".countNum").val());
         })
         $("#header .topbar-ul").find("span").text(count);
      }

   }
   $(function () {
      $.ajax({
         url: "./api/getCart",
         headers: {
            token: localStorage.getItem("token")
         },
         type: "post",
         data: {
            uid: JSON.parse(localStorage.getItem("user")).uId
         }
      }).then(function (res) {
         console.log(res)
         var htmlStr = ``;
         [...res.data].forEach(function (el) {
            htmlStr += `<tr>`;
            htmlStr += `
                          <td><input type="checkbox" name="" id=""></td>
                          <td><img style="float: left; display:block;width:50px;height:50px;" src="${el.gXiaoimg}" alt=""><a
                                  style="float: left; line-height: 50px; font-size: 12px; color:#0066cc;"
                                  href="#">${el.gName} 400ml</a></td>
                          <td>${el.gPrice}</td>
                          <td style="color: #FF0000">-</td>
                          <td>
                              <button id="jianCar" data-info=${el.cid} class="jian_car"style="margin-left: 30px;float: left;">-</button>
                              <input value="${el.gNumer}" data-info=${el.cid} class="countNum"style="text-align:center;font-size: 15px;width: 37px;margin: 0px 3px;color: #666;float: left;">
                              <button id="addCar" data-info=${el.cid} class="add_car" style="float: left;">+</button>
                          </td>
                              <td style="text-align: center;color:#CA0809;font-size:12px;">${el.gTotal}</td>
                              <td style="width:100px">
                                  <a href="#" style="color: #666;font-size: 12px;margin-right: 10px;">收藏</a>
                                  <a class="delBtn" data-info=${el.cid} href="#" style="color: #666;font-size: 12px;">删除</a>
                              </td>
              `;
            htmlStr += `</tr>`;
         })

         $("table tbody").html(htmlStr);
         AddJian();

         (function Count() {
            let count = 0;
            let $tr = $("table tbody tr");
            // console.log($tr)
            $tr.each(function () {
               count += parseInt($(this).find(".countNum").val());
            })
            $("#header .topbar-ul").find("span").text(count);
         })();

      })
   })
})




// $(function () {

//    jQuery.fn.extend({
//       // 参数：
//       // $subCheck：子复选框
//       // $unBtn:反选按钮
//       check: function ($subCheck, $unBtn) {
//          //1、 点击全选复选框
//          this.click(function () {
//             $subCheck.prop("checked", this.checked);
//          });
//          if ($unBtn) {
//             // 点击反选按钮
//             $unBtn.click(function () {
//                $subCheck.each(function () {
//                   // this: 循环时的当前元素
//                   this.checked = !this.checked;
//                });
//                subChangeFather();
//             });
//          }
//          // 点击子复选框
//          $subCheck.click(function () {
//             subChangeFather();
//          })

//          var subChangeFather = () => {
//             // 循环所有的复选框，看看是不是都选中了呢
//             let allCheck = true;//假定都选中了
//             $subCheck.each(function () {
//                // this:循环时的当前dom对象。
//                if (this.checked != true) {
//                   allCheck = false;
//                }
//             });
//             this.prop("checked", allCheck);
//          }
//       }
//    });

//    $(function () {
//       $("table :checkbox:eq(0)").check($("table :checkbox:gt(0)"));
//       $("table :checkbox:last").check($("table :checkbox"));
//       // console.log($(":checkbox"))
//       $(":checkbox").click(function () {
//          totalMoney();
//       });

//       // input框
//       $("tbody tr td").find(".countNum").on("input", function () {
//          // console.log($(this));

//          let count = $(this).val();
//          if (count <= 0 && count != null) {
//             alert("输入有误")
//             // return count=1;
//          }
//          let price = $(this).parent().prev().prev().text();
//          $(this).parent().next().text(price * count).css({ "color": "#C40000", "font-size": "12px" })
//          totalMoney();
//       })


//       // 加
//       $(".add_car").on("click", function () {
//          // 数量
//          let count = $(this).prev().val();
//          // console.log(count);
//          count++;
//          $(this).prev().val(count);
//          // 单价
//          let price = $(this).parent().prev().prev().html();
//          //计算金额
//          let money = price * count;
//          $(this).parent().next().html(money).css({ "color": "#C40000", "font-size": "12px" });

//          //总金额
//          totalMoney();
//       })

//       //减
//       $(".jian_car").on("click", function () {
//          //数量
//          let count = $(this).next().val();
//          count--;
//          if (count <= 1) {
//             count = 1;
//          }
//          $(this).next().val(count);
//          //单价
//          let price = $(this).parent().prev().prev().html();
//          //计算金额
//          let money = price * count;
//          $(this).parent().next().html(money).css({ "color": "#C40000", "font-size": "12px" });

//          // 总金额
//          totalMoney();
//       });

//       $(".delBtn").click(function () {
//          if (confirm("您好，您确定要从购物车中删除该商品吗？")) {
//             $(this).parent().parent().remove();
//             totalMoney();
//          }
//       });
//       $(".delBtn1").click(function () {
//          // $("table :checkbox:eq(0)").check($("table :checkbox:gt(0)"));
//          if (confirm("您好，您确定要清空购物车吗？")) {
//             $(this).parent().parent().parent().parent().find("tr:gt(0)").not("tr:last").remove();
//             totalMoney();
//          }

//       });
//       $(".delBtn2").click(function () {
//          if (confirm("您好，您确定要清空购物车吗？")) {
//             $(this).parent().parent().parent().parent().find("tr:gt(0)").not("tr:last").remove();
//             totalMoney();
//          }
//       });

//    })
//    // console.log($("table tr:last").find("span"));
//    function totalMoney() {
//       let money = 0;
//       let $tr = $("table tr:gt(0)").not("table tr:last");
//       $tr.each(function () {
//          //复选框是不是都选中了
//          // console.log($(this).find("td").eq(5).children("b").text());
//          if ($(this).find(":checkbox").prop("checked")) {
//             money += parseInt($(this).find("td").eq(5).html());
//          }
//          // console.log(money);
//       })
//       // console.log(money);
//       $("table tr:last").find("span").html(money);
//    }
// })